﻿<div>
    <p class="text-left">
        Left aligned text on all viewport sizes.
    </p>
    <p class="text-center">
        Center aligned text on all viewport sizes.
    </p>
    <p class="text-right">
        Right aligned text on all viewport sizes.
    </p>

    <p class="text-sm-left">
        Left aligned text on viewports sized SM (small) or wider.
    </p>
    <p class="text-md-left">
        Left aligned text on viewports sized MD (medium) or wider.
    </p>
    <p class="text-lg-left">
        Left aligned text on viewports sized LG (large) or wider.
    </p>
    <p class="text-xl-left">
        Left aligned text on viewports sized XL (extra-large) or wider.
    </p>
</div>